<!-- 20231120 modify by Alan for#150590 : 補上pagePame避免$mddProvider.GetForm()誤判 -->
<div class="kmi-layout-content B0101-content c-mdd-page" ng-init="init();" page-type="Page" page-name="B0101" _transclude-elem="[object Object]">
    <div class="kmi-header-row">
        <div class="kmi-side-btn left mdd-side-return" ng-hide="_nowForm=='B0101'" ng-click="BackForm(_nowForm);">
            <i class="material-icons"></i>
            <div class="kmi-can-click"></div>
        </div>
        <div class="brand-title">
            <div class="custom" ng-if="companyName">
                <div class="title" ng-bind="companyName"></div>
                <img src="" alt="" class="brand" />
                <div class="gap"></div>
            </div>
            <div class="digiwin">
                <img src="image/smes_v340/logo_ch.png" alt="" />
                <img src="image/smes_v340/logo_en.png" alt="" />
            </div>
        </div>
        <div class="header-title" ng-bind="_title | translate"></div>
    </div>
    <div class="kmi-layout-main-content">
        <div class="mdd-layout c-mdd-layout" layout-name="B0101" ng-show="_nowForm == 'B0101'" page-name="B0101_" page-type="Page" with-toolbar="N" reload="N" _transclude-elem="[object Object]" style="grid-template-columns: repeat(12, auto 1fr)">
            <div item-name="wo_no" class="kmi-text-fields" style="grid-column-start: span 24">
                <label class="label" ng-bind="'B0101.woNo' | translate"></label>
                <input ng-model="wo_no" ng-keypress="barcodeScan($event);" />
                <div class="tip search" ng-click="loadWoNoList();" style="z-index: 2;"><img src="image/icons/search.png" /></div>
                <div class="kmi-button kmi-button-confrim" ng-click="search()" style="width: 100px;z-index: 2">
                    <label ng-bind="'common.btn.search' | translate"></label>
                    <div class="kmi-can-click"></div>
                </div>
            </div>
            <button class="kmi-button kmi-button-confrim btn-qrcode-query" style="grid-column-start: span 2" ng-show="_fn['B0101_search'].isShown != 'N'" ng-disabled="_fn['B0101_search'].isDisabled == 'Y'" ng-click="_fn['B0101_search'].click(B0101_search, 'search', {event:$event});">
                <label>{{'B0101.columns.search' | translate}}</label>
                <div class="kmi-can-click"></div>
            </button>
            <div item-name="wo_info" class="contentPanel" style="height:{{_event['B0101_'].GetfillHeight()}}; grid-column-start: span 24;">
                <div class="input-disabled" ng-show="!workItem"></div>
                <!--工單信息-->
                <div class="leftPanel">
                    <div class="leftPanel-top" ng-show="!showFlag">
                        <div class="mdd-layout c-mdd-layout" layout-name="B0101_WoInfo" page-name="B0101_WoInfo" style="flex: 1 1 0%; grid-template-columns: repeat(12, auto 1fr)" _transclude-elem="[object Object]">
                            <label class="label" ng-show="_event['B0101_WoInfowo_no_display'].isShown != 'N'" style="" ng-bind="'B0101_WoInfo.columns.wo_no_display' | translate"></label>
                            <div class="value" ng-show="_event['B0101_WoInfowo_no_display'].isShown != 'N'" style="grid-column-start: span 11"><label class="value" ng-bind="workItem.wo_no_display" mdl-toast="{{workItem.wo_no_display}}" mdl-toast-passive="true"></label></div>
                            <label class="label" ng-show="_event['B0101_WoInfoprocess_display'].isShown != 'N'" style="" ng-bind="'B0101_WoInfo.columns.process_display' | translate"></label>
                            <div class="value" ng-show="_event['B0101_WoInfoprocess_display'].isShown != 'N'" style="grid-column-start: span 11">
                                <input type="text" readonly="" ng-model="workItem.process_display" ng-click="_event['B0101_WoInfoprocess_display'].click(workItem.process, {event:$event});" ng-disabled="_event['B0101_WoInfoprocess_display'].isDisabled == 'Y'" />
                                <div class="tip"><i class="material-icons"></i></div>
                            </div>
                            <label class="label" ng-show="_event['B0101_WoInfoso_display'].isShown != 'N'" style="" ng-bind="'B0101_WoInfo.columns.so_display' | translate"></label>
                            <div class="value" ng-show="_event['B0101_WoInfoso_display'].isShown != 'N'" style="grid-column-start: span 11"><label class="value" ng-bind="workItem.so_display" mdl-toast="{{workItem.so_display}}" mdl-toast-passive="true"></label></div>
                            <label class="label" ng-show="_event['B0101_WoInfoitem_display'].isShown != 'N'" style="" ng-bind="'B0101_WoInfo.columns.item_display' | translate"></label>
                            <div class="value" ng-show="_event['B0101_WoInfoitem_display'].isShown != 'N'" style="grid-column-start: span 11"><label class="value" ng-bind="workItem.item_display" mdl-toast="{{workItem.item_display}}" mdl-toast-passive="true"></label></div>
                            <label class="label" ng-show="_event['B0101_WoInfocustomer_display'].isShown != 'N'" style="" ng-bind="'B0101_WoInfo.columns.customer_display' | translate"></label>
                            <div class="value" ng-show="_event['B0101_WoInfocustomer_display'].isShown != 'N'" style="grid-column-start: span 11"><label class="value" ng-bind="workItem.customer_display" mdl-toast="{{workItem.customer_display}}" mdl-toast-passive="true"></label></div>
                            <label class="label" ng-show="_event['B0101_WoInfoitem_spec'].isShown != 'N'" style="" ng-bind="'B0101_WoInfo.columns.item_spec' | translate"></label>
                            <div class="value" ng-show="_event['B0101_WoInfoitem_spec'].isShown != 'N'" style="grid-column-start: span 11"><label class="value" ng-bind="workItem.item_spec" mdl-toast="{{workItem.item_spec}}" mdl-toast-passive="true"></label></div>
                            <label class="label" ng-show="_event['B0101_WoInfoplan_start_date'].isShown != 'N'" style="" ng-bind="'B0101_WoInfo.columns.plan_start_date' | translate"></label>
                            <div class="value" ng-show="_event['B0101_WoInfoplan_start_date'].isShown != 'N'" style="grid-column-start: span 11"><label class="value" ng-bind="workItem.plan_start_date" mdl-toast="{{workItem.plan_start_date}}" mdl-toast-passive="true"></label></div>
                            <label class="label" ng-show="_event['B0101_WoInfowo_qty'].isShown != 'N'" style="" ng-bind="'B0101_WoInfo.columns.wo_qty' | translate"></label>
                            <div class="value" ng-show="_event['B0101_WoInfowo_qty'].isShown != 'N'" style="grid-column-start: span 11"><label class="value" ng-bind="workItem.wo_qty" mdl-toast="{{workItem.wo_qty}}" mdl-toast-passive="true"></label></div>
                            <label class="label" ng-show="_event['B0101_WoInfoPLANFINISHDATE'].isShown != 'N'" style="" ng-bind="'B0101_WoInfo.columns.PLANFINISHDATE' | translate"></label>
                            <div class="value" ng-show="_event['B0101_WoInfoPLANFINISHDATE'].isShown != 'N'" style="grid-column-start: span 11"><label class="value" ng-bind="workItem.PLANFINISHDATE" mdl-toast="{{workItem.PLANFINISHDATE}}" mdl-toast-passive="true"></label></div>
                        </div>
                    </div>
                    <!-- 20221122 modify by Alan for#117986 : 支援多行顯示 -->
                    <div id="table_id" class="leftPanel-top" ng-show="showFlag" ng-mouseenter="showTips()" ng-mouseleave="hideTips()">
                        <div ng-repeat="item in packList track by $index" ng-style="getStyle3(item.col)" style="display: flex">
                            <div class="kmi-text-fields" ng-style="getStyle(option)" ng-repeat="option in item.col track by $index">
                                <label class="label" ng-bind="option.fieldName?(option.fieldName+'：'):''" ng-style="getStyle2(option)" style="width: auto; padding-left: 20px; font-weight: 400"></label>
                                <label ng-if="option.fieldId != 'process_display'" class="value" ng-bind="workItem[option.fieldId]" ng-style="getStyle2(option)" style="flex: 1; word-break: break-all"></label>
                                <input ng-if="option.fieldId == 'process_display'" ng-model="workItem[option.fieldId]" ng-style="getStyle2(option)" readonly="readonly" ng-click="loadProcesstDetail();" style="flex: 1; height: 28px" />
                                <div ng-if="option.fieldId == 'process_display'" class="tip"><i class="material-icons"></i></div>
                            </div>
                        </div>
                    </div>
                    <div id="more_id" ng-show="showTipsFlag &amp;&amp; moreInfoList.length > 0" class="popover" style="left: 40%; display: block; visibility: visible; position: absolute; background-color: rgba(100, 100, 100, 0.8) !important; color: #fff !important; padding: 6px 20px 6px 20px; z-index: 9999; border-radius: 6px; min-width: 200px">
                        <div class="triangle-up" style="width: 0; height: 0; border-left: 15px solid transparent; border-right: 15px solid transparent; border-bottom: 10px solid rgba(100, 100, 100, 0.8); position: absolute; top: -10px; left: 45%"></div>
                        <div class="popover-content">
                            <div ng-repeat="item in moreInfoList track by $index">
                                <div ng-bind="(item.fieldName?(item.fieldName+'：'):'')  + workItem[item.fieldId]"></div>
                            </div>
                        </div>
                    </div>
                    <div class="leftPanel-bottom">
                        <div class="mdd-layout c-mdd-layout" layout-name="B0101_PlotInfo" page-name="B0101_PlotInfo" style="flex: 1 1 0%; grid-template-columns: repeat(8, auto 1fr)" _transclude-elem="[object Object]">
                            <label class="label" ng-show="_event['B0101_PlotInfois_urgent'].isShown != 'N'" style="" ng-bind="'B0101_PlotInfo.columns.is_urgent' | translate"></label>
                            <div class="value" ng-show="_event['B0101_PlotInfois_urgent'].isShown != 'N'" style="grid-column-start: span 15">
                                <button class="mdl-button mdl-js-button kmi-checkbox" ng-click="_event['B0101_PlotInfois_urgent'].click('Y', {event:$event});" ng-disabled="_event['B0101_PlotInfois_urgent'].isDisabled == 'Y'">
                                    <img ng-if="workItem.is_urgent == 'Y'" src="image/icons/check1.png" />
                                    <img ng-if="workItem.is_urgent != 'Y'" src="image/icons/check0.png" />
                                    {{'B0101_PlotInfo.displayValues.YesNo.Y' | translate}}</button
                                ><button class="mdl-button mdl-js-button kmi-checkbox" ng-click="_event['B0101_PlotInfois_urgent'].click('N', {event:$event});" ng-disabled="_event['B0101_PlotInfois_urgent'].isDisabled == 'Y'">
                                    <img ng-if="workItem.is_urgent == 'N'" src="image/icons/check1.png" />
                                    <img ng-if="workItem.is_urgent != 'N'" src="image/icons/check0.png" />
                                    {{'B0101_PlotInfo.displayValues.YesNo.N' | translate}}
                                </button>
                            </div>
                            <label class="label" ng-show="_event['B0101_PlotInfopriority'].isShown != 'N'" style="" ng-bind="'B0101_PlotInfo.columns.priority' | translate"></label>
                            <div class="value" ng-show="_event['B0101_PlotInfopriority'].isShown != 'N'" style="grid-column-start: span 15">
                                <input type="text" readonly="" ng-model="workItem.priority" ng-click="_event['B0101_PlotInfopriority'].click(workItem.priority, {event:$event});" ng-disabled="_event['B0101_PlotInfopriority'].isDisabled == 'Y'" />
                            </div>
                            <label class="label" ng-show="_event['B0101_PlotInfountreated_qty'].isShown != 'N'" style="" ng-bind="'B0101_PlotInfo.columns.untreated_qty' | translate"></label>
                            <div class="value" ng-show="_event['B0101_PlotInfountreated_qty'].isShown != 'N'" style="grid-column-start: span 15"><label class="value" ng-bind="workItem.untreated_qty + ' ' + workItem.disposed_unit" mdl-toast="{{workItem.untreated_qty + ' ' + workItem.disposed_unit}}" mdl-toast-passive="true"></label></div>
                            <label class="label" ng-show="_event['B0101_PlotInfoexpand_qty'].isShown != 'N'" style="" ng-bind="'B0101_PlotInfo.columns.expand_qty' | translate"></label>
                            <div class="value" ng-show="_event['B0101_PlotInfoexpand_qty'].isShown != 'N'" style="grid-column-start: span 13">
                                <input type="text" readonly="" ng-model="workItem.expand_qty" ng-click="_event['B0101_PlotInfoexpand_qty'].click(workItem.expand_qty, {event:$event});" ng-disabled="_event['B0101_PlotInfoexpand_qty'].isDisabled == 'Y'" />
                            </div>
                            <label class="label" ng-show="_event['B0101_PlotInfodisposed_unit'].isShown != 'N'" style="" ng-bind="'B0101_PlotInfo.columns.disposed_unit' | translate"></label>
                            <div class="value" ng-show="_event['B0101_PlotInfodisposed_unit'].isShown != 'N'" style="">
                                <label class="value" ng-bind="workItem.disposed_unit" mdl-toast="{{workItem.disposed_unit}}" mdl-toast-passive="true"></label>
                            </div>
                            <label class="label" ng-show="_event['B0101_PlotInfostd_qty'].isShown != 'N'" style="" ng-bind="'B0101_PlotInfo.columns.std_qty' | translate"></label>
                            <div class="value" ng-show="_event['B0101_PlotInfostd_qty'].isShown != 'N'" style="grid-column-start: span 13">
                                <input type="text" readonly="" ng-model="workItem.std_qty" ng-click="_event['B0101_PlotInfostd_qty'].click(workItem.std_qty, {event:$event});" ng-disabled="_event['B0101_PlotInfostd_qty'].isDisabled == 'Y'" />
                            </div>
                            <button class="kmi-button kmi-button-confrim btn-qrcode-query" style="grid-column-start: span 2" ng-show="_fn['B0101_PlotInfoexpand'].isShown != 'N'" ng-disabled="_fn['B0101_PlotInfoexpand'].isDisabled == 'Y'" ng-click="_fn['B0101_PlotInfoexpand'].click(B0101_PlotInfoexpand, 'expand', {event:$event});">
                                <label>{{'B0101_PlotInfo.columns.expand' | translate}}</label>
                                <div class="kmi-can-click"></div></button
                            ><label class="label" ng-show="_event['B0101_PlotInfolength'].isShown != 'N'" style="" ng-bind="'B0101_PlotInfo.columns.length' | translate"></label>
                            <div class="value" ng-show="_event['B0101_PlotInfolength'].isShown != 'N'" style="grid-column-start: span 15"><label class="value" ng-bind="plotItem.length" mdl-toast="{{plotItem.length}}" mdl-toast-passive="true"></label></div>
                            <label class="label" ng-show="_event['B0101_PlotInfodefault_date'].isShown != 'N'" style="" ng-bind="'B0101_PlotInfo.columns.default_date' | translate"></label>
                            <div class="value" ng-show="_event['B0101_PlotInfodefault_date'].isShown != 'N'" style="grid-column-start: span 15">
                                <input type="text" readonly="" ng-model="workItem.default_date" ng-click="_event['B0101_PlotInfodefault_date'].click(workItem.default_date, {event:$event});" ng-disabled="_event['B0101_PlotInfodefault_date'].isDisabled == 'Y'" />
                            </div>
                            <label class="label" ng-show="_event['B0101_PlotInfodescription'].isShown != 'N'" style="grid-row-start: span 2" ng-bind="'B0101_PlotInfo.columns.description' | translate"></label>
                            <div class="value" style="grid-row-start: span 2; grid-column-start: span 15" ng-show="_event['B0101_PlotInfodescription'].isShown != 'N'">
                                <textarea undefined="" ng-model="workItem.description" ng-disabled="_event['B0101_PlotInfodescription'].isDisabled == 'Y'"></textarea>
                            </div>
                        </div>
                        <div class="mdd-list c-mdd-list" list-name="B0101_PlotList" list-bind="plotItem" list-alias="" page-name="B0101_PlotList" style="flex: 1" _transclude-elem="[object Object]">
                            <div class="kmi-list column-selector" kmi-scrollbar="240px" column-selector-id="B0101_PlotList" style="flex: 1">
                                <div class="kmi-list__header">
                                    <div class="kmi-list__column head-controls" style="flex: 1" ng-show="_event['plotItem.plot_no'].isShown != 'N'">
                                        <div class="filter" ng-show="_objplotItem.header[0].isFilter">
                                            <input ng-model="_objplotItem.filterColumns['plot_no']" />
                                            <i class="material-icons clear" style="position: absolute; top: 2px; right: 4px" ng-click="_objplotItem.header[0].isFilter = false;_objplotItem.filterColumns['plot_no'] = '';">clear</i>
                                        </div>

                                        <div class="order" ng-hide="_objplotItem.header[0].isFilter">
                                            <i class="material-icons search" style="z-index: 1" ng-click="_objplotItem.header[0].isFilter = true">search</i>
                                            <label ng-bind="'B0101_PlotList.columns.plot_no' | translate"></label>
                                            <i class="material-icons" ng-show="_objplotItem.queryOrder == 0">{{!_objplotItem.header[0].order?'':''}}</i>
                                            <div class="kmi-can-click" ng-click="orderResult(0, 'plot_no', '_objplotItem');"></div>
                                        </div>
                                    </div>
                                    <div class="kmi-list__column head-controls" style="flex: 1" ng-show="_event['plotItem.plot_qty'].isShown != 'N'">
                                        <div class="filter" ng-show="_objplotItem.header[1].isFilter">
                                            <input ng-model="_objplotItem.filterColumns['plot_qty']" />
                                            <i class="material-icons clear" style="position: absolute; top: 2px; right: 4px" ng-click="_objplotItem.header[1].isFilter = false;_objplotItem.filterColumns['plot_qty'] = '';">clear</i>
                                        </div>

                                        <div class="order" ng-hide="_objplotItem.header[1].isFilter">
                                            <i class="material-icons search" style="z-index: 1" ng-click="_objplotItem.header[1].isFilter = true">search</i>
                                            <label ng-bind="'B0101_PlotList.columns.plot_qty' | translate"></label>
                                            <i class="material-icons" ng-show="_objplotItem.queryOrder == 1">{{!_objplotItem.header[1].order?'':''}}</i>
                                            <div class="kmi-can-click" ng-click="orderResult(1, 'plot_qty', '_objplotItem');"></div>
                                        </div>
                                    </div>
                                </div>
                                <div class="kmi-list__row-content">
                                    <div class="kmi-list__row" id="B0101_PlotList_result_list" ng-repeat="item in _event['plotItem'].getPages(plotItem, _objplotItem.PageConfig, _objplotItem.filterColumns, _objplotItem.header[_objplotItem.queryOrder]) track by $index" ng-class="{'is-select':_event['plotItem'].checkSelect(item, {index:$index, event:$event})}">
                                        <div class="kmi-list__column column-border" style="flex: 1" ng-bind="item.plot_no" ng-if="_event['plotItem.plot_no'].isShown != 'N'"></div>
                                        <div class="kmi-list__column column-input" style="flex: 1; z-index: 1" ng-class="{'column-border':!$last}" ng-show="_event['plotItem.plot_qty'].isShown != 'N'">
                                            <div class="kmi-text-fields">
                                                <input type="text" readonly="" ng-model="item.plot_qty" ng-click="input_plot_qty($event, item);" />
                                            </div>
                                        </div>
                                        <div class="kmi-can-click" ng-click="_event['plotItem'].rowClick(item, {index:$index, event:$event});"></div>
                                    </div>
                                </div>
                            </div>
                            <div class="page-content">
                                <div class="page-icon">
                                    <img src="image/icons/dropleft.png" />
                                    <div class="kmi-can-click" ng-click="prevPage(_objplotItem.PageConfig);"></div>
                                </div>
                                <label ng-bind="pageInfo(_objplotItem.PageConfig);"></label>
                                <div class="page-icon">
                                    <img src="image/icons/dropright.png" />
                                    <div class="kmi-can-click" ng-click="nextPage(_objplotItem.PageConfig);"></div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <!--流程圖-->
                <div class="kmi-list rightPanel none-column-split" ng-show="workItem">
                    <div class="kmi-list__header" style="background: #ffffff; color: black">
                        <div class="kmi-list__column" style="flex: 1; text-align: center" ng-bind="'B0101.processt_detail' | translate"></div>
                    </div>
                    <div class="kmi-list__row-content">
                        <div class="kmi-list__row" ng-repeat-start="item in process_op_detail track by $index">
                            <button class="mdl-button mdl-js-button mdl-button--icon" ng-show="item.op_station_detail.length>1 &amp;&amp; item.index > 0" style="position: absolute; top: calc(50% - 16px); right: 0" ng-click="prevStation(item);">
                                <i class="material-icons">keyboard_arrow_left</i>
                            </button>
                            <div class="kmi-list__column" style="flex: 1 !important; padding: 0px" ng-bind="item.op_station_detail[item.index].op_no"></div>
                            <div class="kmi-list__column" style="flex: 1 !important; padding: 0px" ng-bind="item.op_station_detail[item.index].op_name"></div>
                            <button class="mdl-button mdl-js-button mdl-button--icon" ng-show="item.op_station_detail.length>1 &amp;&amp; item.index < item.op_station_detail.length-1" style="position: absolute; top: calc(50% - 16px); left: 0" ng-click="nextStation(item);">
                                <i class="material-icons">keyboard_arrow_right</i>
                            </button>
                        </div>
                        <div class="arrow" ng-hide="$last">
                            <i class="material-icons"></i>
                        </div>
                        <span ng-repeat-end=""></span>
                    </div>
                </div>
            </div>
            <div item-name="pdf_panel" class="kmi-layout-page" ng-show="_event['pdf_panel'].isShown != 'N'" style="padding: 0px; height:{{_event['B0101_'].GetfillHeight()}}; grid-column-start: span 24;">
                <iframe id="kmi-pdf-panel" name="kmi-pdf-panel"></iframe>
            </div>
            <div item-name="pdf_footer" class="kmi-layout-footer pdf-footer" ng-show="_event['pdf_footer'].isShown != 'N'" style="grid-column-start: span 2">
                <button class="mdl-button mdl-js-button mdl-button--fab mdl-shadow--custom mdl-button--custom1 sub" ng-click="print();">
                    <img src="image/icons/print.png" />
                </button>
                <button class="mdl-button mdl-js-button mdl-button--fab mdl-shadow--custom mdl-button--custom1 sub" ng-click="download();">
                    <img src="image/icons/download.png" />
                </button>
                <button class="mdl-button mdl-js-button mdl-button--fab mdl-shadow--custom mdl-button--custom1" ng-click="cancel();">
                    <img src="image/icons/close.png" />
                </button>
            </div>
        </div>
        <div class="mdd-layout c-mdd-layout" layout-name="B0101_PrintPage" ng-show="_nowForm == 'B0101_PrintPage'" page-name="B0101_PrintPage_" page-type="Page" with-toolbar="N" reload="N" _transclude-elem="[object Object]" style="grid-template-columns: repeat(12, auto 1fr)">
            <label class="label" ng-show="_event['B0101_PrintPage_runcard_preview'].isShown != 'N'" style="" ng-bind="'B0101_PrintPage.columns.runcard_preview' | translate"></label>
            <div class="value" ng-show="_event['B0101_PrintPage_runcard_preview'].isShown != 'N'" style="height:{{_event['B0101_PrintPage_'].GetfillHeight()}};grid-column-start:span 23;"><label class="value" ng-bind="B0101_PrintPage_runcard_preview" mdl-toast="{{B0101_PrintPage_runcard_preview}}" mdl-toast-passive="true"></label></div>
        </div>

        <div class="kmi-layout-footer" ng-show="_nowForm == 'B0101'">
            <button class="mdl-button mdl-js-button mdl-button--fab mdl-shadow--custom mdl-button--custom1" ng-disabled="_fn['B0101_btn_confirm'].isDisabled == 'Y'" ng-hide="_fn['B0101_btn_confirm'].isShown == 'N'" ng-click="_fn['B0101_btn_confirm'].click('btn_confirm');">
                <i class="material-icons">done</i>
            </button>
        </div>
    </div>
</div>
